<ion-header [translucent]="true">
  <ion-toolbar>
    <ion-title> Preview File (Go Pro) </ion-title>
    <ion-buttons slot="start">
      <ion-back-button></ion-back-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

<ion-content [fullscreen]="true">
  <ion-header collapse="condense">
    <ion-toolbar>
      <ion-title size="large">Preview File From Camera (Go Pro)</ion-title>
      <ion-buttons slot="start">
        <ion-back-button></ion-back-button>
      </ion-buttons>
    </ion-toolbar>
  </ion-header>

  <ion-img
    *ngIf="goProFileOnCamera.fileType == 'image'"
    [src]="goProFileOnCamera.fileUrl"
    decoding="async"
    loading="lazy"
  ></ion-img>

  <video
    *ngIf="goProFileOnCamera.fileType == 'video'"
    controls
    playsinline
    preload="metadata"
  >
    <source src="{{ goProFileOnCamera.fileUrl }}#t=0.1" type="video/mp4" />
    Your browser does not support the video tag.
  </video>

  <div style="height: 24px"></div>

  <ion-button (click)="downloadFileFromGoProCamera()" expand="block">
    Download File To Device
  </ion-button>
</ion-content>
